<!-- include tpl=head_lay -->

<!-- if $rs.vtype == 'live' -->
<script type="text/javascript">
function live_start(mytime)
{
	$.dialog.confirm('确定要开启直播吗？请检查下设备是否就绪到位！',function(){
		url = get_plugin_url('oklive','live_start','tid={$rs.id}&mytime='+mytime);
		$.phpok.json(url,function(rs){
			if(!rs.status){
				$.dialog.alert(rs.info);
				return false;
			}
			$.dialog.tips('直播已开启').lock();
			return false;
		})
	});
}
function live_stop()
{
	$.dialog.confirm('确定要结束直播吗？',function(){
		url = get_plugin_url('oklive','live_stop','tid={$rs.id}');
		$.phpok.json(url,function(rs){
			if(!rs.status){
				$.dialog.alert(rs.info);
				return false;
			}
			$.dialog.tips('直播已结束',function(){
				$.phpok.reload();
			}).lock();
			return false;
		})
	});
}
</script>
<div class="layui-card">
	<div class="layui-card-header">
		推流信息及OBS设置
		<div class="layui-btn-group">
			<input type="button" value="开始直播" onclick="live_start('{$mytime}')" class="layui-btn layui-btn-sm" />
			<input type="button" value="结束直播" onclick="live_stop()" class="layui-btn layui-btn-sm layui-btn-danger" />
		</div>
		<input type="button" value="查看" onclick="$.phpok.open('index.php?id={$rs.id}')" class="layui-btn layui-btn-sm" />
	</div>
	<div class="layui-card-body">
		<blockquote class="layui-elem-quote" style="margin-top: 10px;">
			OBS推流请选择【自定义】服务！<br />
			请先设置好相应的推流，再点开始直播
		</blockquote>
		<div class="layui-row layui-col-space10">
			<div class="layui-col-sm12 layui-col-md6">
				<div class="layui-form-item">
					<label class="layui-form-label">
						推流信息
						<input type="button" value="复制" data-clipboard-text="{$rtmp}" class="layui-btn layui-btn-sm phpok-copy" />
					</label>
					<div class="layui-input-block">
						<textarea name="desc" class="layui-textarea" style="resize:none;min-height:50px;" disabled>{$rtmp}</textarea>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">
						OBS 服务器
						<input type="button" value="复制" data-clipboard-text="{$obs_server}" class="layui-btn layui-btn-sm phpok-copy" />
					</label>
					<div class="layui-input-block">
						<textarea name="desc" class="layui-textarea" style="resize:none;min-height:50px;" disabled>{$obs_server}</textarea>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">
						串流密钥
						<input type="button" value="复制" data-clipboard-text="{$obs_key}" class="layui-btn layui-btn-sm phpok-copy" />
					</label>
					<div class="layui-input-block">
						<textarea name="desc" class="layui-textarea" style="resize:none;min-height:50px;" disabled>{$obs_key}</textarea>
					</div>
				</div>
			</div>
			<div class="layui-col-sm12 layui-col-md6">
				<div class="layui-form-item">
					<label class="layui-form-label">
						二维码
					</label>
					<div class="layui-input-block">
						<img src="{$sys.api_file}?f=qrcode&data={func rawurlencode $rtmp}" style="width:200px;height:200px;" />
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<!-- /if -->

<!-- if $rs.vtype == 'vlive' -->
<script type="text/javascript">
function live_start()
{
	$.dialog.confirm('确定要开启直播吗？',function(){
		url = get_plugin_url('oklive','vlivestart','tid={$rs.id}');
		$.phpok.json(url,function(rs){
			if(!rs.status){
				$.dialog.alert(rs.info);
				return false;
			}
			$.dialog.tips('直播已开启').lock();
			return false;
		})
	});
}
function live_stop()
{
	$.dialog.confirm('确定要结束直播吗？',function(){
		url = get_plugin_url('oklive','vlivestop','tid={$rs.id}');
		$.phpok.json(url,function(rs){
			if(!rs.status){
				$.dialog.alert(rs.info);
				return false;
			}
			$.dialog.tips('直播已结束',function(){
				$.phpok.reload();
			}).lock();
			return false;
		})
	});
}
</script>
<div class="layui-card">
	<div class="layui-card-header">
		虚拟直播
	</div>
	<div class="layui-card-body">
		<blockquote class="layui-elem-quote" style="margin-top: 10px;">
			虚拟直播是系统将要播放的视频指定时间后统一播放<br />
			类似在线直播，所有人在同一时间看到的内容是一样的（受带宽影响，有大约3-5秒的误差）
		</blockquote>
		<div class="layui-btn-group">
			<input type="button" value="开始直播" onclick="live_start()" class="layui-btn layui-btn-sm" />
			<input type="button" value="结束直播" onclick="live_stop()" class="layui-btn layui-btn-sm layui-btn-danger" />
		</div>
	</div>
</div>
<!-- /if -->
<!-- if $rs.vtype == 'vod' -->
<div class="layui-card">
	<div class="layui-card-header">
		视频点播
	</div>
	<div class="layui-card-body">
		<blockquote class="layui-elem-quote" style="margin-top: 10px;">
			点播服务即后台上传视频，前台会员随时可以进去查看<br />
			并且都是从开始播放的，如果有开放播放进度条控制，则可以拖放控制条
		</blockquote>
	</div>
</div>
<!-- /if -->
<!-- if $rs.vtype == 'link' -->
<div class="layui-card">
	<div class="layui-card-header">
		外链视频
	</div>
	<div class="layui-card-body">
		<blockquote class="layui-elem-quote" style="margin-top: 10px;">
			外链视频即后台关联外部视频加接，前台会员随时可以进去查看<br />
			这里仅显示在当前页面的统计数据
		</blockquote>
	</div>
</div>
<!-- /if -->
<!-- if $log_stat -->
<script type="text/javascript">
var is_mychart = 0;
var myChart;
function delete_stat_info(time)
{
	$.dialog.confirm('确定要删除观看记录信息？删除后不能恢复',function(){
		var url = get_plugin_url('oklive','statinfo_delete','tid={$rs.id}&livetime='+time);
		$.phpok.json(url,function(rs){
			if(!rs.status){
				$.dialog.alert(rs.info);
				return false;
			}
			$.phpok.reload();
		})
	});
}
function show_stat_info(time)
{
	var t = $.dialog.tips('正在加载数据…');
	$("#stat_html").hide();
	if(is_mychart == 0){
		
	}
	if(is_mychart == 1){
		myChart.dispose();
	}
	$("#chart_main").html('');
	var url = get_plugin_url('oklive','statinfo','tid={$rs.id}&livetime='+time);
	$.phpok.json(url,function(rs){
		t.close();
		if(!rs.status){
			$.dialog.tips(rs.info);
			return false;
		}
		var html = template('art-tpl', {
		    rslist: rs.info.rslist
		});
		$("#stat_info").html(html);
		$("#stat_html").show();
		if(rs.info.x && rs.info.y){
			is_mychart = 1;
	        // 指定图表的配置项和数据
	        myChart = echarts.init(document.getElementById('chart_main'));
	        var option = {
	            legend: {
	                data:['访问量']
	            },
	            xAxis: {
	                data: rs.info.x
	            },
	            yAxis: {},
	            series: [{
	                name: '访问量',
	                type: 'line',
	                stack:'在线用户数',
	                data: rs.info.y
	            }]
	        };
	        myChart.setOption(option,true);
		}
	})
}
</script>
<div class="layui-card">
	<div class="layui-card-header">
		统计
	</div>
	<div class="layui-card-body">
		<table class="layui-table">
		<thead>
		<tr>
			<th>直播时间</th>
			<th>观看人数</th>
			<th>操作</th>
		</tr>
		</thead>
		<!-- loop from=$log_stat key=$key value=$value id=$tmpid -->
		<tr>
			<td>{func date 'Y-m-d H:i:s' $key}</td>
			<td>{$value}</td>
			<td>
				<div class="layui-btn-group">
					<input type="button" value="明细及统计" onclick="show_stat_info('{$key}')" class="layui-btn layui-btn-sm" />
					<input type="button" value="删除" onclick="delete_stat_info('{$key}')" class="layui-btn layui-btn-sm layui-btn-danger" />
				</div>
				
			</td>
		</tr>
		<!-- /loop -->
		</table>
	</div>
</div>
<div id="stat_html" style="display:none">
	<div class="layui-row layui-col-space10">
		<div class="layui-col-md6" id="stat_info">

		</div>
		<div class="layui-col-md6" id="stat_tb">
			<div class="layui-card">
				<div class="layui-card-header">
					报表统计
				</div>
				<div class="layui-card-body">
					<div id="chart_main" class="layui-carousel" data-anim="fade" lay-filter="LAY-index-normcol" lay-anim="fade" style="width: 100%; height:650px;"></div>
				</div>
			</div>
		</div>
	</div>
</div>
<script id="art-tpl" type="text/html">
<div class="layui-card">
	<div class="layui-card-header">
		明细
	</div>
	<div class="layui-card-body">
		<table class="layui-table">
		<thead>
		<tr>
			<th>姓名</th>
			<th>观看时间</th>
			<th>时长</th>
			<th>考勤及其他</th>
		</tr>
		</thead>
		<% for(var i in rslist){ %>
		<tr>
			<td>
				<%= rslist[i].user %>
			</td>
			<td>
				<%= rslist[i].startdate %>
				<% if (rslist[i].stopdate) { %>
				至 <%= rslist[i].stopdate %>
				<% } %>
			<td><%= rslist[i].longtime_format %></td>
			<td><%= rslist[i].kaoqin %></td>
		</tr>
		<% } %>
		</table>
	</div>
</div>
</script>
<!-- /if -->
<!-- include tpl=foot_lay -->